<extend name="en_us:Public:base" />
<block name="title">
    <title>My center</title>
</block>
<block name="extendHead">
    <link rel="stylesheet" type="text/css" href="/Public/jslib/toastr/2.1.2/toastr.min.css?rev=e36d7ff8c89b5bb6e9db66a169d59c47">
    <link rel="stylesheet" type="text/css" href="/Public/dist/Home/UserPage/index.css?rev=1ae2a8a8e64331f5440ea30cf2avb37b">
    <style type="text/css">
    	.user-header{
    	    height: 78px;
    	    padding-top: 40px;
    	}
    	.header-top{
    	    text-align: center;
    	    font-size: 20px;
    	    height: 22px;
    	    line-height: 22px;
    	}
    	.header-bottom{
    	    color: #cb8600;
    	    text-align: center;
    	    margin-top: 10px;
    	    font-size:13px ;
    	}
    </style>
</block>
<block name="document">
    <div id="doc" class="container">
        <!--<div id="doc-header" class="navbar">
            <a href="/Home/BookPage/index?hotel={$hotelId}" class="pull-left navbar-icon"><span class="iconfont icon-chevronleft"></span></a>
            <div class="navbar-title typo-text-white-deep">My center</div>
        </div>-->
        <div id="doc-body">    
            <div class="user-header">
            	<div class="header-top">
            		<span>{:$name == '' ? $mobile: $name;}</span>
            	</div>
                <div class="header-bottom">
                    <span>Donation amount{$defaultSymbol}</span><span class="totalCharity"></span>
                </div>
            </div>
            <notempty name="level">
            <div class="horizontal-padding-sm bottom-divider  vertical-padding">
                <div class="vertical-padding has-icon-line">
                    <span class="vip-one-icon"></span>
                    <div class="typo-text-black-deep">{$level}</div>
                </div>
            </div>
            </notempty>
            <div class="horizontal-padding-sm bottom-divider vertical-padding">
                <div class="vertical-padding has-icon-line">
                    <span class="photo-one-icon"></span>
                    <div class="typo-text-black-deep">Phone number</div>
<!--                    <div class="user-name" style="display: inline-block;">{:$name === $mobile ? 'None': $name;}</div>-->
                    <div class="user-num" style="position: absolute;right: 8px;top: 50%;margin-top: -12px;">{:isset($mobile) ? '+' . $areaCode . ' ' . $mobile: '';}</div>
                </div>
            </div>
            <div class="horizontal-padding-sm bottom-divider vertical-padding parent-idCard-one-icon" >
                <div class="vertical-padding has-icon-line icon-line-both idCard-one-icon">
                    <span></span>
                    <div class="typo-text-black-deep">ID Cards Information</div>
                    <div class="bindIdCardNum hidden"></div>
                    <div class="unBindIdCard hidden">Unbound</div>
                </div>
            </div>
            <a href="/Home/OrderPage/list?hotel={$hotelId}" class="horizontal-padding-sm bottom-divider vertical-padding" >
                <div class="vertical-padding has-icon-line icon-line-both ">
                    <span class="order-one-icon"></span>
                    <div class="typo-text-black-deep">My Order</div>
                    <div class="enter"></div>
                    <!--<span class="iconfont icon-chevronright icon-line-right typo-text-black-light"></span>-->
                </div>
            </a>
            <a href="/Home/RoomPage/list?hotel={$hotelId}" class="horizontal-padding-sm bottom-divider vertical-padding">
                <div class="vertical-padding has-icon-line icon-line-both">
                    <span class="key-one-icon"></span>
                    <div class="typo-text-black-deep">My key</div>
                    <div class="enter"></div>
                    <!--<span class="iconfont icon-chevronright icon-line-right typo-text-black-light"></span>-->
                </div>
            </a>            
            <a href="/Home/MemberPage/cardlist?hotel={$hotelId}" class="horizontal-padding-sm bottom-divider vertical-padding">
                <div class="vertical-padding has-icon-line icon-line-both">
                    <span class="card-one-icon"></span>
                    <div class="typo-text-black-deep">My cards</div>
                    <div class="enter"></div>
                </div>
            </a>
            <a href="/Home/CouponPage/couponlist?hotel={$hotelId}" class="horizontal-padding-sm  vertical-padding">
                <div class="vertical-padding has-icon-line icon-line-both">
                    <span class="coupon-one-icon"></span>
                    <div class="typo-text-black-deep">My coupons</div>
                    <div class="enter"></div>
                </div>
            </a>
        </div>
        <div class="top-divider" style="height: 1px;width: 100%; "></div>
        <div class="align-parent-bottom">
            <a  href="/Home/UserPage/logout?hotel={$hotelId}">Sign out</a>
        </div>
    </div>
    <include file="en_us:Public:Include_identification_modal"/>
    <include file="en_us:Public:Include_loading" is-hidden="hidden"/>
    <canvas class="hidden"></cancas>
</block>
<block name="extendFootJs">
    <script type="text/javascript" src="/Public/jslib/toastr/2.1.2/toastr.min.js?rev=1778e466055d4a265993e979c174c338"></script>
    <script type="text/javascript" src="/Public/dist/Home/UserPage/index.js?rev=97a92d0d5e58e9da23ae16fbc90962ad"></script>
</block>
